<template>
    <div>
        <div class="ff">
          <img class="jt" src="/static/dhw/dhw-5.png" alt="">
          <p class="zi">阿拉粉心得</p>
          <p></p>
        </div>
      <div class="xd">
        <router-link to="/xdxq">
        <p>全部心得</p>
        </router-link>
        <p class="shuxian"></p>
        <router-link to="/shaitu">
          <p class="qbxd">晒图</p>
        </router-link>
      </div>
      <div class="nicheng">
        <p class="nc"><img src="/static/fcxd/fcxd-1.png" alt="">昵称</p>
        <p class="nc">2017-06-28</p>
      </div>
      <p class="mk">该模块主要内容是顾客对购买的商品的评价...该模块主要内容是顾客对购买的商品的评价...</p>
      <div class="kuang">
        <img src="/static/fcxd/fcxd-2.png" alt="">
      </div>
      <div class="cz">
        <p class="k"><img src="/static/fcxd/fcxd-5.png" alt="">245</p>
        <p class="xian"></p>
        <p class="k"><img src="/static/fcxd/fcxd-6.png" alt="">199</p>
        <p class="xian"></p>
        <p class="k"><img src="/static/fcxd/fcxd-7.png" alt="">278</p>
      </div>
      <div class="dizuo">
        <router-link to="/swxq">
          <p class="jiazai">加载更多</p>
        </router-link>
      </div>

    </div>
</template>

<script>
    export default {
        name: "Shaitu"
    }
</script>

<style scoped>
  .ff{
    display:flex;
    justify-content: space-around;
    align-items: center;
    height: 9.6rem;
    background: #e53e42;
  }

  .zi{
    font-size: 4.8rem;
    color: #fff;
  }
  .jt{
    width: 2.2rem;
    height: 3.8rem;
  }
  .xd{
    display:flex;
    justify-content: space-around;
    align-items: center;
    height: 8.1rem;
    /*background: aqua;*/
    font-size: 3rem;
    border-bottom: 1px solid #ccc;
  }
  .shuxian{
    width: 0.2rem;
    height: 6rem;
    background: #ccc;
  }
  .qbxd{
    color: #e53e42;
  }
  .nicheng{
    width: 68rem;
    height: 24rem;
    display:flex;
    justify-content: space-between;
    margin-left: 2rem;
  }
  .nc{
    margin-top: 2rem;
  }
  .mk{
    height: 6rem;
    margin-top: -14rem;
    font-size: 2.4rem;
    color: #ccc;
    margin-left: 2rem;
  }
  .cz{
    border-top: 1px solid #ccc;
    display:flex;
    justify-content: space-around;
    align-items: center;
    font-size: 2.4rem;
  }
  .xian{
    width: 0.2rem;
    height: 4rem;
    background: #ccc;
    margin-top: 1rem;
  }
  .k{
    margin-top: 1rem;
  }
  .tiao{
    height: 2rem;
    margin-top: 2.3rem;
    margin-bottom: 2.3rem;
    background: #ccc;
  }
  .kuang{
    width: 26rem;
    height: 20rem;
    text-align: center;
    border: 1px solid #ccc;
    margin-bottom: 2.4rem;
  }
  .dizuo{
    width: 72rem;
    height: 50rem;
    margin-top: 2rem;
    background: #ccc;
  }
  .jiazai{
    font-size: 2.4rem;
    text-align: center;
    padding-top: 45rem;
  }
</style>
